<template>
	<view>
		<view class="head">
			<view class="user-box">
			<view class="user-info-box">
				<van-image class="herdimg" round width="100" height="100" fit="cover" src="https://s1.328888.xyz/2022/06/15/p7282.jpg" :show-loading="false" />
				<view class="user-info">
					<text class="user_name">{{this.$store.getters.name}}</text>
					<text class="user_class_name">{{this.$store.getters.class_name}}</text>
					<text class="user_major_name">{{this.$store.getters.major_name}}</text>
				</view>
			</view>
		</view>
		</view>
		<van-cell-group class="setList">
		  <van-cell icon="./static/icon/server.svg" title="联系客服" is-link/>
			<van-cell icon="./static/icon/service.svg" title="版本信息" is-link/>
			<van-cell icon="./static/icon/about.svg" title="关于我们" is-link/>
			<van-cell icon="./static/icon/exit.svg" is-link title="登出" @click="EXIT"/>
		</van-cell-group>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			EXIT() {
				this.$store.dispatch('user/logout').then(res => {
					uni.reLaunch({
						url: '../login/index'
					})
				})
			},
			load() {

			}
		}
	}
</script>

<style>
	.setList{margin-top: 20rpx;}
	.setList .van-icon{display: flex;align-items: center;}
	.herdimg{border: solid #ffb520 6rpx;background-color: #ffffff;}
	.user-info-box{transform: translateY(180rpx);display: flex;align-items: flex-end;padding-left: 20rpx;}
	.user-box {
		width: 100%;
		height: 250rpx;
		background: url(https://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=https%3A%2F%2Fgimg2.baidu.com%2Fimage_search%2Fsrc%3Dhttp%253A%252F%252Fpic1.win4000.com%252Fwallpaper%252F2020-08-27%252F5f47540d3c243.jpg%26refer%3Dhttp%253A%252F%252Fpic1.win4000.com%26app%3D2002%26size%3Df9999%2C10000%26q%3Da80%26n%3D0%26g%3D0n%26fmt%3Dauto%3Fsec%3D1657812696%26t%3Def709d73f5e533074ea9eeabf3bcbb89&thumburl=https%3A%2F%2Fimg1.baidu.com%2Fit%2Fu%3D1556755759%2C1061603115%26fm%3D253%26fmt%3Dauto%26app%3D138%26f%3DJPEG%3Fw%3D500%26h%3D313) no-repeat;
		background-size:100% auto;
		background-position: center;
	}
	.head{background-color: #ffffff;height: 410rpx;}

	.user-info {
		display: flex;
		flex-direction: column;
		padding-left: 20rpx;
	}
	.option{font-size: 28rpx;font-weight: 500;}
	.user_name {
		font-weight: bold;
		font-size: 36rpx;
	}
</style>
